<template>
	<view>
		<!-- #ifdef MP-WEIXIN -->
		<myheader :leftType="2" :noLeft="false" showTitle="档案详情" showBackground="#EAECEF">
		</myheader>
		<view
			style="margin-top: 10px;text-align: center;font-size: 12px;font-size: 400;color:#8292A2;display: flex;justify-content: center;">
			<view>隐私数据仅在向您服务时使用，您可随时删除这些数据。</view>
		</view>
		<view style="margin-top: 10px;padding: 10px;">
			<view style="background-color: white;border-radius: 5px;">
				<view
					style="border-bottom:1px solid #EFEFEF;height: 96px; padding: 10px;display: flex;justify-content: flex-start;align-items: center">
					<view style="height: 70px;width: 70px;min-width: 70px;margin-right: 10px;">
						<image :src="physiqueArchiveInfo.profilePhoto"
							style="width:70px;height: 70px;border-radius: 5px;" />
					</view>
					<view
						style="height: 70px;display: flex;flex-direction: column;justify-content:flex-start">
						<view style="font-size: 20px;color:#2E4964;font-weight: 700;width:200px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
							{{physiqueArchiveInfo.name}}</view>
						<view style="color:#8292A2;font-size: 12px;font-weight: 400;margin-top: 5px;">
							更新时间：{{ physiqueArchiveInfo.updateTime? returnTime(physiqueArchiveInfo.updateTime):'--' }}
						</view>
						<!-- <view style="color: #1ABC9C;font-size: 14px;font-weight: 400;margin-top: 5px;">
							<view style="display: inline-block;margin-right: 10px;">修改名称</view>
							<view style="display: inline-block;margin-right: 10px;">拍照</view>
							<view style="display: inline-block;margin-right: 10px;">相册</view>
						</view> -->
					</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">性别</view>
					<view style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">{{ returnGender(physiqueArchiveInfo.gender) }}</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">年龄</view>
					<view style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">{{ physiqueArchiveInfo.age || '' }}岁</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">身高</view>
					<view style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">{{ physiqueArchiveInfo.height || '' }}厘米</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">体重</view>
					<view style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">{{ physiqueArchiveInfo.weight || '' }}kg</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">腰围</view>
					<view style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">{{ physiqueArchiveInfo.waistline || '' }}厘米</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">民族</view>
					<view style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">{{ physiqueArchiveInfo.nationName || '' }}</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">宗教信仰</view>
					<view v-if="physiqueArchiveInfo.faith" style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">
						<view v-for="(item, index) in physiqueArchiveInfo.faith" :key="index">{{ item.name }}<text v-if="physiqueArchiveInfo.faith.length>1 && index !== physiqueArchiveInfo.faith.length - 1">、</text></view>
					</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">喜欢味型</view>
					<view v-if="physiqueArchiveInfo.perferTaste" style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">
						<view v-for="(ele, idx) in physiqueArchiveInfo.perferTaste" :key="idx">{{ ele.name }}<text v-if="physiqueArchiveInfo.perferTaste.length>1 && idx!== physiqueArchiveInfo.perferTaste.length - 1">、</text></view>
					</view>
				</view>
				<view style="padding: 20px 10px 20px 10px;border-bottom:1px solid #EFEFEF;">
					<view style="color:#8292A2;font-size: 16px;font-weight: 400;">喜好烹饪方式</view>
					<view v-if="physiqueArchiveInfo.preferCooking" style="color:#2E4964;font-size: 16px;font-weight: 700;margin-top: 10px;">
						<view v-for="(lo, iox) in physiqueArchiveInfo.preferCooking" :key="iox">{{ lo.name }}<text v-if="physiqueArchiveInfo.preferCooking.length>1 && iox !==physiqueArchiveInfo.preferCooking.length - 1">、</text></view>
					</view>
				</view>
			</view>
		</view>
		<view style="width: 10px;height: 140px;"></view>
		<!-- #endif -->
		 <view class="sub-btn" @tap="deleteDangan">删除档案</view>
	</view>
</template>

<script>
	import mytabbar from '../../components/my-tabbar/index.vue';
	import myheader from '../../components/header/index.vue';
	export default {
		components: {
			mytabbar,
			myheader
		},
		data() {
			return {
				physiqueArchiveInfo: {
					"id": null,
				},
				modifyType: "detail",
				nationOptionList: []
			}
		},
		onLoad(e) {
			if (e.physiqueArchiveid != null) {
				this.physiqueArchiveInfo.id = e.physiqueArchiveid;
			} else {
				uni.navigateBack();
			}
			if (e.modifyType != null) {
				this.modifyType = e.modifyType;
				return;
			}
			if (this.modifyType != "detail" && this.modifyType != "update") {
				uni.navigateBack();
				return;
			}
		},
		onShow() {
			uni.showLoading({
				title: '正在加载中...',
				mask: true
			});
			this.getDetail();
		},
		methods: {
			returnGender(str) {
				if (str == 1) {
					return '男'
				}
				if (str == 2) {
					return '女'
				}
				return ''
			},
			returnTime(timeArr) {
				return timeArr[0] + '-' + timeArr[1] + '-' + timeArr[2] + ' ' + timeArr[3] + ':' + timeArr[4] + ':' + timeArr[5]
			},
			getListToString(listItem){
				let content="";
				for(let i=0;i<listItem.length;i++){
					content=content+listItem.name
				}
				content=content.Substring(0,content.Length-1)
				return content
			},
			deleteDangan() {
				let that = this
				uni.showModal({
					content: '确定要删除数据吗',
					confirmColor: "#E02828",
					success: function (res) {
						if (res.confirm) {
							uni.showLoading({
								title: '删除中',
								mask: true
							})
							that.trueDel()
						} else if (res.cancel) {
							return false;
						}
					},
				});
				
			},
			trueDel() {
				this.$H.put(("portal/posture/del?id=" + this.physiqueArchiveInfo.id)).then((res) => {
					uni.hideLoading();
					if (res.code == 0) {
						uni.navigateback()
					} else {
						uni.showToast({
							title: res.msg,
							icon: "none"
						})
					}
				});
			},
			getDetail() {
				this.$H.postToB("manage/basic/searchRace").then(info => {
					if (info.code == 0) {
						this.nationOptionList = info.data
						this.$H.get("portal/posture/get", {
							id: this.physiqueArchiveInfo.id
						}).then((res) => {
							uni.hideLoading();
							if (res.code == 0) {
								this.physiqueArchiveInfo = res.data;
								for (let i = 0; i< this.nationOptionList.length;i++) {
									if (res.data.nation == this.nationOptionList[i].id) {
										this.physiqueArchiveInfo.nationName = this.nationOptionList[i].nationName
										break
									}
								}
							} else {
								uni.showToast({
									title: res.msg,
									icon: "none"
								})
							}
						});
					}
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
.sub-btn {
		z-index: 99;
		position: fixed;
		left: 0;
		bottom: 0;
		padding-bottom: calc(constant(safe-area-inset-bottom));
		padding-bottom: calc(env(safe-area-inset-bottom));
		font-size: 16px;
		font-weight: bold;
		line-height: calc(constant(safe-area-inset-bottom) + 66rpx);
		line-height: calc(env(safe-area-inset-bottom) + 66rpx);
		color:#fff;
		width: 100%;
		height: 66rpx;
		background: #1ABC9C;
		display: flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0px 5px 45px 0px #ABB6C1,inset 0px -10px 16px 0px rgba(255, 255, 255, 0.15),inset 0px 3px 5px 0px rgba(255, 255, 255, 0.15),inset 3px 10px 15px 0px rgba(255, 255, 255, 0.35);
	}
</style>